<table class="table table-bordered table-hover table-striped table-keep-line" style="margin-top:unset !important;">
  <thead>
    <tr role="row">
      <th *ngIf="listType == '1'||listType == '2'||listType == '6'||listType == '7'">
        <div class="cell" style="width:50px !important">
          <div class="checkbox checkbox-primary">
            <input type="checkbox" id="isCheckedAll" [(ngModel)]="isCheckedAll" name="isCheckedAll" (ngModelChange)="checkedAll()">
            <label>
            </label>
          </div>
        </div>
      </th>
      <th *ngIf="listType == '4'||listType == '5'||listType == '6'">
        <div class="cell">序号
        </div>
      </th>
      <th *ngIf="listType == '6'">
        <div class="cell" (click)="orderData('sCreator')">提交人
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell" (click)="orderData('nNdId')">编号
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th *ngIf="listType == '4'||listType == '5'||listType == '6'||listType == '7'">
        <div class="cell" (click)="orderData('nBatchNo')">批次号
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th *ngIf="listType == '7'">
        <div class="cell">条目复核意见
        </div>
      </th>
      <th *ngIf="listType == '6'||listType == '7'">
        <div class="cell" (click)="orderData('sFlowStepZh')">当前流程
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th *ngIf="listType == '6'||listType == '7'">
        <div class="cell" (click)="orderData('sOprStateZh')">处理状态
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th *ngIf="listType == '6'||listType == '7'">
        <div class="cell" (click)="orderData('nSortNo')">条目顺序
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th *ngIf="listType == '4'||listType == '5'||listType == '6'">
        <div class="cell" (click)="orderData('sValidZh')">是否有效
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th *ngIf="listType == '1'">
        <div class="cell risk-MarkBlue" (click)="orderData('sLatestChange')">最近变更时间
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkBlue" (click)="orderData('sFileName')">文件名称
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkBlue" (click)="orderData('f1')">内容
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkBlue" (click)="orderData('sItemTypeZh')">属性
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkBlue" (click)="orderData('sFileSourceZh')">条款出处
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkBlue" (click)="orderData('sFundTypeZh')">适用基金类别
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkBlue" (click)="orderData('sFundGroupdsZh')">适用基金组
          <i class="fa fa-sort"></i>
        </div>
      </th>

      <th>
        <div class="cell risk-MarkBlue" (click)="orderData('f2')">指标释义
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkBlue" (click)="orderData('f3')">条目规定阀值
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkGreen" (click)="orderData('f4Zh')">事中控制方法
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkGreen" (click)="orderData('f5')">事中系统控制阀值
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkGreen" (click)="orderData('f6')">是否事中系统可控
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkGreen" (click)="orderData('f7')">系统风控编号
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkGreen" (click)="orderData('f8')">事中系统备注
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkRed" (click)="orderData('f9')">事后监控方法
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkRed" (click)="orderData('f10')">监控编号
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkRed" (click)="orderData('f11')">控制说明
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkRed" (click)="orderData('f12')">补偿控制
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkRed" (click)="orderData('f13')">风险等级
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkRed" (click)="orderData('f14')">监察部备注1
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkRed" (click)="orderData('f15')">监察部备注2
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkYellow" (click)="orderData('f16')">场外系统阀值(新股,定增,转债)
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkYellow" (click)="orderData('f17')">场外系统阀值(公增)
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkYellow" (click)="orderData('f18')">是否场外系统可控
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkYellow" (click)="orderData('f19')">场外风控编号
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell risk-MarkYellow" (click)="orderData('f20')">场外系统备注
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell" (click)="orderData('sCreator')">录入人
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell" (click)="orderData('sLaunchDate')">录入时间
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell" (click)="orderData('sCheckPerson')">条目复核
          <i class="fa fa-sort"></i>
        </div>
      </th>
      <th>
        <div class="cell" (click)="orderData('sCheck')">复核时间
          <i class="fa fa-sort"></i>
        </div>
      </th>


    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let item of listData;let index = index;">
      <td *ngIf="listType == '1'||listType == '2'||listType == '6'||listType == '7'">
        <div class="cell" style="width:50px !important" *ngIf="listType == '6'||listType == '7'&&item.sFlowStep != null">
          <div class="checkbox checkbox-primary">
            <input type="checkbox" name="checkbox1" [(ngModel)]="item.isChecked" (ngModelChange)="ctrlCheckAll()">
            <label>
            </label>
          </div>
        </div>
      </td>
      <td *ngIf="listType == '4'||listType == '5'||listType == '6'" class="short_name" [attr.title]="index+1">
        <div class="cell">{{index+1}}
        </div>
      </td>
      <td *ngIf="listType == '6'" class="short_name" [attr.title]="item.sCreator">{{item.sCreator}}</td>
      <td class="short_name" [attr.title]="item.nNdId">
        <div *ngIf="listType != '3'&&listType != '4'&&listType != '5'&&listType != '6'&&listType != '7'" class="cell" [ngClass]="{'dataChange':item.sState =='在途'}">{{item.nNdId}}
        </div>
        <div *ngIf="listType == '3'||listType == '4'||listType == '5'||listType == '6'||listType == '7'" class="cell">{{item.nNjId}}
        </div>
      </td>
      <td *ngIf="listType == '4'||listType == '5'||listType == '6'||listType == '7'" class="short_name" [attr.title]="item.nBatchNo">
        <div class="cell">{{item.nBatchNo}}
        </div>
      </td>
      <td *ngIf="listType == '7'" class="short_name" [attr.title]="item.sOprMark">
        <div>
          <input class="input-width" name="sOprMark" maxlength="100" [(ngModel)]="item.sOprMark">
        </div>
      </td>
      <td *ngIf="listType == '6'||listType == '7'" class="short_name" [attr.title]="item.sFlowStepZh">
        <div name="sFlowStepZh" class="font-color">
          {{item.sFlowStepZh}}
        </div>
      </td>
      <td *ngIf="listType == '6'||listType == '7'" class="short_name" [attr.title]="item.sOprStateZh">
        <div name="sOprStateZh" class="font-color">
          {{item.sOprStateZh}}
        </div>
      </td>
      <td *ngIf="listType == '6'||listType == '7'" class="short_name" [attr.title]="item.nSortNo">
        <div name="nSortNo" class="font-color">
          {{item.nSortNo}}
        </div>
      </td>
      <td *ngIf="listType == '4'||listType == '5'||listType == '6'" class="short_name" [attr.title]="item.sValidZh">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].sValidZh == 'red'}">{{item.sValidZh}}</div>
      </td>
      <td *ngIf="listType == '1'" class="short_name" [attr.title]="item.sLatestChange">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].sLatestChange == 'red'}">{{item.sLatestChange}}</div>
      </td>
      <td class="short_name" [attr.title]="item.sFileName">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].sFileName == 'red'}">{{item.sFileName}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f1">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f1 == 'red'}">{{item.f1}}</div>
      </td>
      <td class="short_name" [attr.title]="item.sItemTypeZh">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].sItemTypeZh == 'red'}">{{item.sItemTypeZh}}</div>

      </td>
      <td class="short_name" [attr.title]="item.sFileSourceZh">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].sFileSourceZh == 'red'}">{{item.sFileSourceZh}}</div>
      </td>
      <td class="short_name" [attr.title]="item.sFundTypeZh">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].sFundTypeZh == 'red'}">{{item.sFundTypeZh}}</div>
      </td>
      <td class="short_name" [attr.title]="item.sFundGroupdsZh">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].sFundGroupdsZh == 'red'}">{{item.sFundGroupdsZh}}</div>
      </td>

      <td class="short_name" [attr.title]="item.f2">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f2 == 'red'}">{{item.f2}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f3">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f3 == 'red'}">{{item.f3}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f4Zh">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f4Zh == 'red'}">{{item.f4Zh}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f5">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f5 == 'red'}">{{item.f5}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f6Zh">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f6Zh == 'red'}">{{item.f6Zh}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f7">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f7 == 'red'}">{{item.f7}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f8">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f8 == 'red'}">{{item.f8}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f9Zh">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f9Zh == 'red'}">{{item.f9Zh}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f10">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f10 == 'red'}">{{item.f10}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f11">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f11 == 'red'}">{{item.f11}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f12">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f12 == 'red'}">{{item.f12}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f13Zh">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f13Zh == 'red'}">{{item.f13Zh}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f14">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f14 == 'red'}">{{item.f14}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f15">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f15 == 'red'}">{{item.f15}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f16">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f16 == 'red'}">{{item.f16}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f17">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f17 == 'red'}">{{item.f17}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f18Zh">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f18Zh == 'red'}">{{item.f18Zh}}</div>
      </td>
      <td class="short_name" [attr.title]="item.f19">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f19 == 'red'}">{{item.f19}}</div>

      </td>
      <td class="short_name" [attr.title]="item.f20">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].f20 == 'red'}">{{item.f20}}</div>
      </td>
      <td class="short_name" [attr.title]="item.sCreator">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].sCreator == 'red'}">{{item.sCreator}}</div>
      </td>
      <td class="short_name" [attr.title]="item.sLaunchDate">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].sLaunchDate == 'red'}">{{item.sLaunchDate}}</div>
      </td>
      <td class="short_name" [attr.title]="item.sCheckPerson">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].sCheckPerson == 'red'}">{{item.sCheckPerson}}</div>
      </td>
      <td class="short_name" [attr.title]="item.sCheck">
        <div class="cell" [ngClass]="{'dataChange': setColor[index].sCheck == 'red'}">{{item.sCheck}}</div>
      </td>
    </tr>
  </tbody>

</table>